<template>
  <div class="container">
    <div class="banner">
      <img
        :src="'http://testattachment.fuguowealth.com/' + enterpricedata.titleImg.picture"
        alt="企业概况"
      />
      <h2>企业概况</h2>
    </div>
    <div class="doc">
      <div class="gjleft">
        <span class="imgGoin">
          <img :src="'http://testattachment.fuguowealth.com/' + enterpricedata.companyProfile.imgUrl"
            alt="财富管理，款爷投资，风险投资"
          />
        </span>
        <!-- 企业概况 -->
        <div>
          <h3 class="title">企业概况</h3>
          <!-- <h3 class="title">{{enterpricedata.titles[0].titleName}}</h3> -->
          <p class="intro" v-html="enterpricedata.companyProfile.content"></p>
        </div>
        <!-- 发展历程 -->

        <div>
          <h3 class="title">发展历程</h3>
          <!-- <h3 class="title">{{enterpricedata.titles[1].titleName}}</h3> -->
          <ul
            class="Timeline"
            v-for="(item, index) in enterpricedata.developmentCourse"
            :key="index"
          >
            <li>
              <h4>{{ item.dateNum }}</h4>
              <p v-for="(items, indexs) in item.developmentHistoryList" :key="indexs" v-html="items.content"></p>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import { selectAllByYear_list } from '@/api/index.js';
export default {
  data() {
    return {
      enterpricedata:[],
      // 企业概况
      listEnterpriseverview:[],
      // 发展历程
      listDevelopmentHistory: [
      ],
      // 右侧图片
      imagesdata:[]
    };
  },
  created() {
    this.getData();
    
  },
  methods: {
     
    // 获取数据
    getData() {
      const data={id:'4900202105191705688'}
      
      selectAllByYear_list(data).then(res=> {
            console.log(res.data,'企业概况');
          this.enterpricedata = res.data
      })
      .catch(error=>{
          console.log(error)
      });
    },
  },
};
</script>
<style lang="less" scoped>
.container {
  width: 78.5%;
  left: 12.5%;
  position: absolute;
  top: 0;
  min-width: 1050px;
  max-width: 1200px;
  box-shadow: 5px 0 5px #f0f0f0;
  font-family: "微软雅黑";
  .banner {
    width: 100%;
    position: relative;
    img {
      width: 100%;
    }
    h2 {
      font-weight: 500;
      color: #fff;
      opacity: 0.7;
      font-size: 42px;
      line-height: 42px;
      position: absolute;
      left: 25px;
      top: 40%;
    }
  }
  .doc {
    padding: 0 0 50px 30px;
    .gjleft {
      width: 100%;
      position: relative;
      text-align: left;
      .imgGoin {
        width: 35%;
        position: absolute;
        top: 7.3%;
        right: 10%;
        max-width: 505px;
        img {
          width: 100%;
        }
      }
      .title {
        border-left: 4px solid #ee020d;
        height: 26px;
        line-height: 26px;
        padding-left: 10px;
        font-size: 22px;
        margin: 40px 0;
        font-weight: normal;
      }
      .intro {
        text-indent: 33px;
        font-size: 16px;
        margin-top: 30px;
        width: 50%;
        letter-spacing: 2px;
        margin-left: 18px;
        font: 16px/1.7 Tahoma, "Hiragino Sans GB", "Microsoft YaHei", arial,
          simsun, sans-serif;
      }
      // 时间轴
      .Timeline {
        border-left: 2px solid #fa504b;
        position: relative;
        margin-left: 32px;
        z-index: 15;
        top: 20px;
        li {
          width: 90%;
          top: -20px;
          position: relative;
          left: -32px;
          z-index: 20;
          list-style-type: none;
          h4 {
            background: url(http://www.juyike.cn/Public/Home/images/year.png)
              no-repeat;
            width: 66px;
            height: 66px;
            color: #fa504b;
            font-size: 20px;
            text-align: center;
            line-height: 66px;
          }
          p {
            margin: 20px 0 20px 65px;
            position: relative;
            line-height: 30px;
          }
          p:nth-of-type(1):before {
            content: "";
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background: #fa504b;
            position: absolute;
            left: -38px;
            top: 10px;
          }
        }
      }
    }
  }
}
</style>
